<div class="palm-page-header multi-line">
	<div class="palm-page-header-wrapper">
        <div class="pref-icon">
            <img src="images/icon_pref.png"></img>
        </div>
		<div class="title" x-mojo-loc=''>
			MensaPlan Preferences
		</div>   
	</div>                                                                                                                                                                         
</div>

<div class="palm-group">
	<div class="palm-group-title" x-mojo-loc="">
        General
    </div>
	<div class="palm-list">
		<div class="palm-row single">
			<div class="palm-row-wrapper">
				<div x-mojo-element="ToggleButton" id="togglebuttonImg" class="togglebuttonClass" name="togglebuttonImg"></div>
                <div class="title" x-mojo-loc="">Food Images</div>
			</div>
		</div>
	</div>
</div>

<div class="palm-group">
	<div class="palm-group-title" x-mojo-loc="">
        Filter
    </div>
	<div class="palm-list">
		<div class="palm-row first">
			<div class="palm-row-wrapper">
				<div x-mojo-element="ToggleButton" id="togglebuttonFilter" class="togglebuttonClass" name="togglebuttonFilter"></div>
                <div class="title" x-mojo-loc="">Filter Food</div>
			</div>
		</div>
		<div class="palm-row">
			<div class="palm-row-wrapper">
				<div x-mojo-element="ToggleButton" id="togglebuttonWhole" class="togglebuttonClass" name="togglebuttonWhole"></div>
                <div class="title" x-mojo-loc="">Whole Words Only</div>
			</div>
		</div>		
		<div class="palm-row last">
			<div class="palm-row-wrapper">
				<div id='editableListContainer'>
					<div id="wordsList" x-mojo-element="List" >
					</div>
				</div>
			</div>
		</div>
	</div>

</div>
